<template>
    <div id="root_box">
        <el-dialog :title="title" :visible.sync="isShow" @close="cancel" width="590px" top="40vh">
            <p style="text-align:center">{{context}}</p>
            <div class="tableBtnBox">
                <button class="btn1" @click="cancel">取消</button>
                <button class="btn2" @click="confirm">确认</button>
            </div>
        </el-dialog>
    </div>
</template>
<script>
export default {
    data() {
        return {
            addVisible: false
        };
    },
    props: {
        context: {
            type: String,
            default: '提示框内容'
        },
        title: {
            type: String,
            default: '标题'
        },
        isShow: {
            type: Boolean,
            default: false
        }
    },
    methods: {
        cancel() {
            this.$emit('cancel');
        },
        confirm() {
            this.$emit('confirm');
        }
    }
};
</script>
<style scoped lang="scss">
#root_box {
    .tableBtnBox {
        margin-top: 1.875rem /* 30/16 */;
        text-align: center;
        .btn1 {
            width: 90px;
            height: 35px;
            background: rgba(0, 79, 171, 0.2);
            border-radius: 5px;
            border: none;
            font-size: 16px;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: rgba(0, 79, 171, 1);
            margin-right: 56px;
            cursor: pointer;
        }
        .btn2 {
            width: 90px;
            height: 35px;
            background: rgba(0, 79, 171, 1);
            border-radius: 5px;
            border: none;
            font-size: 16px;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: rgba(255, 255, 255, 1);
            cursor: pointer;
        }
    }
    .el-form-item__content {
        margin-left: 0 !important;
    }
}
</style>